<template>
  <view class="user-wallet">
    <view class="contain bg-white m-b-20">
      <!-- 资产总计 -->
	   <!-- 钱包 -->
     <!-- <view class="header">
       <view class="white m-b-20">
          <view class="xs balance">我的余额(元)</view>
          <view style="font-size: 76rpx;margin-top: 30rpx;" >￥{{
            wallet.user_money || "0.00"
          }}</view>
        </view>
	<view class="white m-b-20">
		<view class="" style="display: flex; align-items: center;">
			<image style="width: 60rpx; height: 50rpx; " src="/static/images/picture.png" mode=""></image>
			<view class="xs balance" style="margin-left: 20rpx;">我的余额(元)</view>
		</view>
	  
	  <view style="font-size: 76rpx;margin-top: 30rpx;" >￥{{
	    wallet.user_money || "0.00"
	  }}</view>
	</view>
        <view class="money white flex">
          <view class="item">
            <view class="xs">水滴数量</view>
            <view style="font-size: 38rpx">{{
              wallet.total_recharge_amount || "0.00"
            }}</view>
          </view>
          <view class="item">
            <view class="xs">可用水票</view>
            <view style="font-size: 38rpx">{{
              "0.00"
            }}</view>
          </view>
		  <view class="item">
		    <view class="xs">可用积分</view>
		    <view style="font-size: 38rpx">{{
		       "0.00"
		    }}</view>
		  </view>
		  <view class="item">
		    <view class="xs">购物券</view>
		    <view style="font-size: 38rpx">{{
		      "0.00"
		    }}</view>
		  </view>
          <template v-if="wallet.open_racharge">
            <router-link
              style="height: 58rpx"
              class="flex primary bg-white br60 btn"
              size="xs"
              to="/bundle/pages/user_payment/user_payment"
              >充值</router-link
            >
          </template>
        </view>
      </view> -->
	  
	  <view class="header">
	  	<!-- 门店钱包 -->
	  <view class="white m-b-20">
	  	<view class="" style="display: flex; align-items: center;">
	  		<image style="width: 60rpx; height: 50rpx; " src="/static/images/picture.png" mode=""></image>
	  		<view class="xs balance" style="margin-left: 20rpx;">舒克大坏蛋</view>
	  	</view>
	    <view style="font-size: 76rpx;margin-top: 30rpx;" >￥{{
	      wallet.user_money || "0.00"
	    }}</view>
		<view class="" style="display: flex; justify-content: space-between;">
			<view class="">
				可提现佣金
			</view>
			<view class="but_sty">
				提现
			</view>
		</view>
	  </view>
	      <view class="money white flex">
	        <template v-if="wallet.open_racharge">
	          <router-link
	            style="height: 58rpx"
	            class="flex primary bg-white br60 btn"
	            size="xs"
	            to="/bundle/pages/user_payment/user_payment"
	            >充值</router-link>
	        </template>
	      </view>
	    </view>

      <!-- 资金明细 -->
      <view class="nav flex">
        <!-- <router-link class="nav-item">
					<view class="flex-col col-center">
						<image class="icon" src="../../static/icon_yezz.png"></image>
						<view class="m-t-10 sm">余额转账</view>
					</view>
				</router-link> -->
       <!-- <router-link class="nav-item" to="/bundle/pages/user_bill/user_bill">
          <view class="flex-col col-center">
            <image class="icon" src="../../static/icon_zhmx.png"></image>
            <view class="m-t-10 sm">账户明细</view>
          </view>
        </router-link> -->
        <!-- 	<router-link class="nav-item">
					<view class="flex-col col-center">
						<image class="icon" src="../../static/icon_zzjl.png"></image>
						<view class="m-t-10 sm">转账记录</view>
					</view>
				</router-link> -->
     <!--   <router-link
          class="nav-item"
          to="/bundle/pages/recharge_record/recharge_record"
        >
          <view class="flex-col col-center">
            <image class="icon" src="../../static/icon_czjl.png"></image>
            <view class="m-t-10 sm">充值记录</view>
          </view>
        </router-link> -->
      </view>

      <!-- 热门活动 -->
<!--      <view class="activity">
       
        <block v-for="(item, index) in activityList" :key="item.title">
          <view
            class="activity-item flex row-between"
            :style="{ backgroundColor: item.background }"
          >
            <view>
              <view class="xl normal" style="font-weight: 500">{{
                item.title
              }}</view>
              <view class="muted sm m-t-10">{{ item.slogan }}</view>
              <router-link style="display: inline-block" :to="item.href">
                <view
                  :style="{ backgroundColor: item.buttonColor }"
                  class="br60 white join-btn flex row-center"
                  >立即参与</view>
              </router-link>
            </view>
            <image
              style="width: 274rpx; height: 210rpx"
              :src="item.image"
            ></image>
          </view>
        </block>
      </view> -->
	  
    </view>
	<view class="activity-title xl flex" style="margin-bottom: 30rpx;">
	  <view
	    class="m-r-20 bg-primary"
	    style="width: 6rpx; height: 30rpx;background-color: #0271E4; margin-left: 20rpx;"
	  ></view>
	  <text>消费明细</text>
	</view>
	<view class="list_data">
		<view class="" >
			<view class="list_font1">充值</view>
			<view class="list_font2">2022-05-26 13:51:13</view>
		</view>
		<view class="list_font3">
			+999
		</view>
	</view>
  </view>
</template>

<script>
// +----------------------------------------------------------------------
// | likeshop开源商城系统
// +----------------------------------------------------------------------
// | 欢迎阅读学习系统程序代码，建议反馈是我们前进的动力
// | gitee下载：https://gitee.com/likeshop_gitee
// | github下载：https://github.com/likeshop-github
// | 访问官网：https://www.likeshop.cn
// | 访问社区：https://home.likeshop.cn
// | 访问手册：http://doc.likeshop.cn
// | 微信公众号：likeshop技术社区
// | likeshop系列产品在gitee、github等公开渠道开源版本可免费商用，未经许可不能去除前后端官方版权标识
// |  likeshop系列产品收费版本务必购买商业授权，购买去版权授权后，方可去除前后端官方版权标识
// | 禁止对系统程序代码以任何目的，任何形式的再发布
// | likeshop团队版权所有并拥有最终解释权
// +----------------------------------------------------------------------
// | author: likeshop.cn.team
// +----------------------------------------------------------------------

import { getWallet } from "@/api/user";
export default {
  data() {
    return {
      wallet: {},
      // 热门活动列表数据
      activityList: [
        {
          title: "领取优惠券",
          slogan: "每日优惠券抢不停",
          button: "立即抢购",
          buttonColor: "#FC597A",
          href: "/bundle/pages/get_coupon/get_coupon",
          image: "/bundle/static/img_activity_coupon.png",
          background: "rgba(252, 89, 122, 0.1)",
        },
        {
          title: "超值商品 限时秒杀",
          slogan: "最新商品秒杀中",
          button: "立即抢购",
          buttonColor: "#FF2C3C",
          href: "/bundle/pages/goods_seckill/goods_seckill",
          image: "/bundle/static/img_activity_seckill.png",
          background: "rgba(236, 71, 37, 0.1)",
        },
      ],
    };
  },

  onShow() {
    this.getWalletFun();
  },

  methods: {
    getWalletFun() {
      getWallet().then((res) => {
		  console.log(res,'ressssssssssssss')
        if (res.code == 1) {
          this.wallet = res.data;
        }
      });
    },
  },
};
</script>
<style lang="scss">
.user-wallet {
	.list_data{
		width: 710rpx;
		margin-left: 20rpx;
		background-color: #fff;
		border-radius: 20rpx;
		height: 114rpx;
		margin-bottom: 20rpx;
		display: flex;
		 justify-content: space-between;
		 align-items: center;
		.list_font1{
			width: 100rpx;
			height: 66rpx;
			text-align: center;
			line-height: 66rpx;
			font-weight: bold;
			font-size: 28rpx;
			color: #000000;
		}
		.list_font2{
			// width: 300rpx;
			margin-left: 34rpx;
			font-weight: 400;
			font-size: 22rpx;
			color: #999999;
			
		}
		.list_font3{
			font-weight: bold;
			font-size: 28rpx;
			color: #333333;
			margin-right: 40rpx;
		}
	}
  .contain {
    padding: 20rpx 30rpx 36rpx;
    .header {
      position: relative;
   background: linear-gradient( 135deg, #49A1F9 0%, #327DEE 100%);
      border-radius: 20rpx;
      height: 320rpx;
      padding: 20rpx 30rpx  30rpx;
      box-sizing: border-box;
	  .but_sty{
		  width: 150rpx;
		  height: 56rpx;
		  background-color: #fff;
		  text-align: center;
		  line-height: 56rpx;
		  border-radius: 30rpx;
		  color: #327DEE;
	  }
	.balance{
		
	}
      .money {
		  display: flex;
		  justify-content: space-between;
        .item {
          text-align: center;
        }
      }
      .btn {
        position: absolute;
        right: 30rpx;
        top: 50rpx;
        padding: 0 51rpx;
      }
    }

    .nav {
      border-bottom: $-solid-border;
      .nav-item {
        width: 25%;
        padding: 40rpx 0;
        .icon {
          width: 52rpx;
          height: 52rpx;
        }
      }
    }
  }
}

.activity {
  padding: 40rpx 0rpx;

  .activity-title {
    font-weight: bold;
  }

  .activity-item {
    padding: 15rpx 40rpx;
    // box-shadow: 0px 0rpx 20rpx rgba(0, 0, 0, 0.16);
    margin-top: 34rpx;

    .join-btn {
      height: 52rpx;
      width: 156rpx;
      margin-top: 24rpx;
    }
  }
}
</style>
